<template>
	<view class="">
		<view v-if="info.is_agent === 100 || info.is_agent === 102" class="status-hint">
			<!-- 点击进入采购订单详情页面 -->
			<view class="iconfont icon-gantanhao"></view>
			<block v-if="info.is_agent === 100">
				<view class="">您的申请资料未提交,请支付定金后提交</view>
			</block>
			<block v-if="info.is_agent === 102">
				<view class="">您的申请资料已通过审核,待支付尾款激活</view>
			</block>
			<view class="link-btn">查看</view>
		</view>
		
		<view class="agent-manage">
			<view class="my-card" style="padding-top: 0; padding-bottom: 0; background-color: transparent;">
				<view class="flex align-center justify-between">
					<view class="title">{{ info.linkman }}服务商</view>
					<view class="tags">
						<view v-if="info.is_agent === 1" class="tag-item tag-success">已激活</view>
						<view v-if="info.is_agent === 102" class="tag-item tag-wait">待激活</view>
					</view>
				</view>
			</view>
			<view class="my-card">
				<view class="option-list" style="padding-top: 0;">
					<view class="option-item" @click="goProcureList">
						<view class="item-title">采购订单</view>
						<view class="flex align-center">
							<!-- <view class="dadge">99</view> -->
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view class="option-item" @click="goPage('/pages/agent/lease/lease')">
						<view class="item-title">租赁订单</view>
						<view class="flex align-center">
							<!-- <view class="item-sub-title">9</view> -->
							<!-- <view class="dadge">99</view> -->
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					
				</view>
			</view>
			
			<view v-if="false" class="my-card">
				<view class="option-list" style="padding-top: 0;" @click="goFinanceDetail">
					<view class="option-item">
						<view class="item-title">财务流水</view>
						<view class="flex align-center">
							<view class="item-sub-title"></view>
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view class="option-item" @click="goFinanceDetail">
						<view class="item-title">报表中心</view>
						<view class="flex align-center">
							<view class="item-sub-title"></view>
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
				</view>
			</view>
			
			<view class="my-card">
				<view class="option-list" style="padding-top: 0;">
					<view class="option-item" @click="goBaseInfo">
						<view class="item-title">基础信息</view>
						<view class="flex align-center">
							<view class="item-sub-title"></view>
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view class="option-item" @click="goPage('/pages/user-list/user-list')">
						<view class="item-title">用户管理</view>
						<view class="flex align-center">
							<view v-if="waitAgentCount" class="item-sub-title">{{waitAgentCount}}</view>
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view v-if="false" class="option-item" @click="goFinanceDetail">
						<view class="item-title">代理商排行榜</view>
						<view class="flex align-center">
							<!-- <view class="item-sub-title">您当前排名第10名</view> -->
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view v-if="false" class="option-item" @click="goFinanceDetail">
						<view class="item-title">我的仓库</view>
						<view class="flex align-center">
							<!-- <view class="item-sub-title">9个设备</view> -->
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view class="option-item" @click="goAddress">
						<view class="item-title">地址管理</view>
						<view class="flex align-center">
							<view class="item-sub-title"></view>
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
					<view v-if="false" class="option-item" @click="goFinanceDetail">
						<view class="item-title">消息通知</view>
						<view class="flex align-center">
							<!-- <view class="dadge">99</view> -->
							<view class="item-sub-title"></view>
							<view class="iconfont icon-arrow-right"></view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {},
				waitAgentCount: '', // 待审核用户数
			};
		},
		onLoad() {
			this.agentGetHistoryInfo()
			this.agentUserIdentityList()
		},
		methods: {
			// 获取用户管理未审核数据
			agentUserIdentityList() {
				const params = {
					page: 1,// 页码
					limit: 9999, // 页数
					key: '', // 关键字
					is_audit: 0
				}
				this.$api.agentUserIdentityListApi(params).then(res=> {
					this.waitAgentCount = res.data.filter(item=> item.is_audit === 10).length
					
				}).catch(err=> {
					console.log('err', err);
				})
			},
			// 获取历史信息
			agentGetHistoryInfo() {
				this.$api.agentGetHistoryInfoApi().then(res => {
					this.info = res.data
					this.info.identity_card_data = res.data.identity_card_data ? res.data.identity_card_data.split(
						',').map(item => ({
						url: item
					})) : []; // string  可选 身份证图片，多个逗号分隔“,”，可调用“文件上传”上传文件至云服务器
					this.info.student_card_data = res.data.student_card_data ? res.data.student_card_data.split(
						',').map(item => ({
						url: item
					})) : []; // string  可选 学生证图片，多个逗号分隔“,”，可调用“文件上传”上传文件至云服务器
					this.info.asset_certificate_data = res.data.asset_certificate_data ? res.data
						.asset_certificate_data.split(',').map(item => ({
							url: item
						})) : []; // string  可选 资产证明图片，多个逗号分隔“,”，可调用“文件上传”上传文件至云服务器
					this.info.credit_report_data = res.data.credit_report_data ? res.data.credit_report_data.split(
						',').map(item => ({
						url: item
					})) : []; // string  可选 征信报告图片，多个逗号分隔“,”，可调用“文件上传”上传文件至云服务器
					this.info.club_card_data = res.data.club_card_data ? res.data.club_card_data.split(',').map(
						item => ({
							url: item
						})) : []; // string  可选 社团图片，多个逗号分隔“,”，可调用“文件上传”上传文件至云服务器
				}).catch(err => {
					console.log('err', err);
				})
			},
			// 前往地址
			goAddress() {
				uni.navigateTo({
					url: '/pages/address/address'
				})
			},
			// 前往基础信息
			goBaseInfo() {
				uni.navigateTo({
					url: '/pages/agent/base-info/base-info'
				})
			},
			// 前往采购单
			goProcureList() {
				uni.navigateTo({
					url: '/pages/agent/procure/procure'
				})
			},
			goPage(url) {
				uni.navigateTo({
					url
				})
			},
			goFinanceDetail() {
				uni.showToast({
					icon: 'none',
					title: '建设中···'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	.status-hint {
		position: relative;
		height: 96rpx;
		font-size: 26rpx;
		font-weight: 400;
		line-height: 36rpx;
		text-align: left;
		color: rgba(0, 0, 0, 0.6);
		background-color: #fff0ed;
		padding: 8rpx 32rpx;
		border-radius: 12rpx;
		box-sizing: border-box;
		
		display: flex;
		align-items: center;
		
		.icon-gantanhao {
			width: 32rpx;
			height: 32rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			
			font-size: 32rpx;
			color: #D54941;
			margin-right: 16rpx;
		}
		
		.link-btn {
			position: absolute;
			right: 32rpx;
			font-size: 26rpx;
			font-weight: 400;
			line-height: 36rpx;
			text-align: left;
			color: rgba(0, 61, 153, 1);
		}
	}
	
	.agent-manage {
		padding: 24rpx 32rpx;
		box-sizing: border-box;
		padding-bottom: calc(200rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
		padding-bottom: calc(200rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
		
		
		
		.my-card {
			padding: 32rpx;
			margin-bottom: 32rpx;
			border-radius: 26rpx;
			background-color: #ffffff;
			
			.title {
				font-size: 34rpx;
				font-weight: 600;
				line-height: 46rpx;
				text-align: left;
				color: #000000;
			}
			
			.status {
				color: #FFFFFF;
				font-size: 18rpx;
				font-weight: 400;
				line-height: 24rpx;
				text-align: left;
				
				display: flex;
				align-items: center;
				justify-content: center;
				
				padding: 4rpx 8rpx;
				border-radius: 8rpx;
				border-radius: 8rpx;
			}
			
			.status-wait {
				background-color: #003D99;
			}
			
			.status-success {
				background-color: #009D6E;
			}
		}
		
		.tags {
			display: flex;
			align-items: center;
			gap: 10rpx;
		}
		
		.tag-item {
			display: flex;
			align-items: center;
			justify-content: center;
			
			padding: 4rpx 8rpx;
			border-radius: 8rpx;
			background-color: #868686;
			
			color: #FFFFFF;
			font-size: 18rpx;
			font-weight: 400;
			line-height: 24rpx;
			text-align: left;
		}
		
		.tag-success {
			background-color: #009D6E;
		}
		
		.tag-complate {
			background-color: #D4D4D4;
		}
		
		.tag-wait {
			background-color: #003D99;
		}
		.tag-error {
			background-color: #ff5252;
		}
		
		.option-list {
			padding-top: 28rpx;
			
			.option-item {
				width: 100%;
				height: 84rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				
				
				.item-title {
					font-size: 28rpx;
					font-weight: 400;
					line-height: 38rpx;
					text-align: left;
					color: #000000;
				}
				
				.item-sub-title {
					font-size: 28rpx;
					font-weight: 400;
					text-align: left;
					line-height: 38rpx;
					color: rgba(0, 0, 0, 0.5);
				}
				
				.dadge {
					min-width: 32rpx;
					height: 32rpx;
					border-radius: 99px;
					border-radius: 50%;
					background-color: red;
					padding: 4rpx 6rpx;
					
					font-size: 18rpx;
					font-weight: 400;
					text-align: left;
					line-height: 24rpx;
					color: #ffffff;
					
					display: flex;
					align-items: center;
					justify-content: center;
				}
				
				.iconfont {
					font-size: 16rpx;
					margin-left: 18rpx;
				}
				
				
			}
		}
	}
</style>
